<%@ page language="java" contentType="text/html" pageEncoding="utf-8"%>
<%String path = request.getContextPath();String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()+ path + "/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<link rel="stylesheet" type="text/css" href="css/edittable.css"></link>
<link rel="stylesheet" type="text/css" href="css/validate.css"></link>
<script type="text/javascript" src="js/jquery-1.8.0.js"></script>

<script>

	$(function() {
		
		$("input[type=text],textarea").focus(function() {
			$(this).addClass("input_focus");
		}).blur(function() {
			$(this).removeClass("input_focus");
		});

		$(".form_btn").hover(function() {
			$(this).css("color", "red").css("background", "#6FB2DB");
		},

		function() {
			$(this).css("color", "#295568").css("background", "#BAD9E3");
		});
		
		var ok1=false;/* 角色名验证是否通过 */

		$("#roleName").blur(function() {/* 验证用户名 */
			var name=$("#roleName").val();//当前用户输入的值
			var flag=false;
			
			/* 验证角色名是否符合格式 */
		  	var reg = /[^\s]{2,15}/; //2-15位；非空白字符
			if(!reg.test(name)){
				$("#roleName_msg").text("角色名格式非法!").removeClass().addClass("validate_error");
				ok1=false;
			}else{
				$("#roleName_msg").text("√").removeClass().addClass("validate_ok");
				ok1=true;
			}  
			
		});
		
		$("#roleName").focus(function() {
			$("#roleName_msg").text("2-15位；非空白字符").removeClass().addClass("validate_info");
		});
		$("#form_btn").click(function(){/* 提交的总验证 */
			var result=false;
			$("#roleName").blur();
			if(ok1){
				result=true;
            }else{
            	$("#result_msg").text("信息填写有误").removeClass().addClass("validate_error");
            	return result;
            }
			if(result==true){
				 result=confirm("确定要提交吗");
			}
			return result;

        }); 
		
	});

</script>
</head>

<body>
	<div class="div_title">
		<div class="div_titlename">
			<img src="images/san_jiao.gif"><span>管理员添加</span>
		</div>
	</div>

	<form id="role_add_form" action="RoleServlet.do" method="post" onsubmit="return validate()">
		<input type="hidden" name="flag" value="add">
		<table class="edit_table">
			<tr>
				<td class="td_info">
					用户账号:
				</td>
				<td class="td_input_short">
					<input type="text" class="txtbox"id="roleName" name="roleName" value="${param.roleName}"/>
				</td>
				<td>
					<label class="validate_info" id="roleName_msg">2-15位；非空白字符</label>
				</td>
			</tr>
			
			<tr>
				<td class="td_info">
					备注信息:
				</td>
				<td>
					<textarea rows="4" cols="27" name="des" class="txtarea" >${param.des}</textarea>
				</td>
				<td>
					<label></label>
				</td>
			</tr>
			<tr>
				<td class="td_info"></td>
				<td>
					<input id="form_btn" class="form_btn" type="submit" value="提交" /> 
					<input type="reset" class="form_btn" value="重置" />
				</td>
				<td>
					<label id="result_msg" class="result_msg">${msg}</label>
				</td>
			</tr>
		</table>
	</form>
</body>
</html>
